<extend name="admin/main"/>

<block name="title">
    <title>用户列表</title>
</block>

<block name="css"></block>

<block name="heading">用户列表</block>

<block name="content">
    <div class="row">
        <form method="get">
            <div class="col-md-8">
                <input type="hidden" name="page" value="{$page}">
                <div class="input-group">
                        <span class="input-group-addon">
                            <i class="fa fa-search"></i>
                        </span>
                    <input type="search" class="form-control" placeholder="Search" name="search" value="{$search}">
                </div>
            </div>
            <div class="col-md-4">
                <button type="submit" class="btn btn-success"><i class="fa fa-search"></i> 搜索</button>
            </div>
        </form>
    </div>
    <h4>List</h4>
    <div class="row">
        <foreach name="data" item="item" key="key">
            <div class="col-sm-3">
                <div class="panel panel-profile"
                     style="visibility: visible; opacity: 1; display: block; transform: translateY(0px);">
                    <div class="panel-body">
                        <img src="{$item.avatar}" class="img-circle" height="96">
                        <div class="name">{$item.username}</div>
                        <div class="info">{$item.email}</div>
                        <ul class="list-inline text-center">
                            <li>
                                <a href="/admin/user/edit?id={$item.id}" class="profile-facebook-icon tooltips"
                                   data-toggle="tooltip" data-placement="top" title="编辑用户">
                                    <i class="fa fa-edit"></i>
                                </a>
                            </li>
                            <li>
                                <a class="profile-twitter-icon delete tooltips" data-toggle="tooltip"
                                   data-placement="top" title="删除用户" data-id="{$item.id}">
                                    <i class="ti ti-trash"></i>
                                </a>
                            </li>
                            <li>
                                <a class="profile-dribbble-icon tooltips" data-toggle="tooltip" data-placement="top"
                                   title="{$item.role}">
                                    <i class="ti ti-medall"></i>
                                </a>
                            </li>
                            <li>
                                <a class="btn btn-warning tooltips ban" data-toggle="tooltip" data-id="{$item.id}"
                                   data-placement="top" title="封禁 [{$item.ban}]">
                                    <i class="ti ti-na text-danger"></i>
                                </a>
                            </li>
                        </ul>
                    </div>
                </div>
            </div>
        </foreach>
        <div class="col-md-12">
            {$users->link(['search' => $search])}
        </div>
    </div>
</block>

<block name="js">
    <script type="text/javascript" src="__PUBLIC__/assets/demo/demo.js"></script>
    <script type="text/javascript" src="__PUBLIC__/assets/demo/demo-switcher.js"></script>
    <script type="text/javascript" src="__PUBLIC__/assets/plugins/bootbox/bootbox.js"></script>

    <script>
        $(document).ready(function () {
            $('.delete').click(function (e) {
                var $this = $(this);
                bootbox.confirm("是否删除？", function (result) {
                    if (result === true) {
                        deleteUser($this.attr('data-id'));
                    }
                });
            });
            $('.ban').click(function () {
                var id = $(this).attr('data-id');
                bootbox.prompt({
                    size: 'small',
                    title: '请输入时间? -1 位永久 1代表一分钟 0 代表解除BAN',
                    inputType: 'number',
                    callback: function(result){
                        if (result === null || isNaN(result)) return;
                        $.post('/admin/adminUser/ban', {id: id, time: result}, function (res) {
                            res = JSON.parse(res);
                            if (res.success === true) {
                                window.location.reload();
                            } else {
                                new PNotify({
                                    title: 'Oh On!',
                                    text: res.data,
                                    type: 'error',
                                    icon: 'ti ti-info-alt',
                                    styling: 'fontawesome'
                                });
                            }
                        });
                    }
                })
            });
        });

        function deleteUser(id) {
            ajax({id: id}, function (res) {
                if (res.success === true) {
                    window.location.reload();
                } else {
                    new PNotify({
                        title: 'Oh On!',
                        text: res.data,
                        type: 'error',
                        icon: 'ti ti-info-alt',
                        styling: 'fontawesome'
                    });
                }
            });
        }


        function ajax(data, callback) {
            var settings = {
                "async": true,
                "crossDomain": true,
                "url": "/admin/adminUser/delete",
                "method": "POST",
                "headers": {
                    "content-type": "application/x-www-form-urlencoded"
                },
                "data": data
            };

            $.ajax(settings).done(function (response) {
                callback(JSON.parse(response));
            });
        }
    </script>
</block>
